<template>
  <div class="mdEditorCss">
    <h2 style="text-align: center;">{{ name }}</h2>
    <v-md-editor v-model="content.content" :mode="`preview`"></v-md-editor>
  </div>
</template>

<script>
import { ref } from "vue"
import { RouterView, RouterLink } from "vue-router";
export default {
  data() {
    return {
      id: 0,
      name:"",
      content:{}
    }
  },
  created(){
    this.id = this.$route.query.id;
    this.name = this.$route.query.name;
    this.loadData()
  },
  methods: {
    loadData() {
      this.$axios.get(`/home/book/content?id=${this.id}`).then(({ data }) => {
        if (data.code == 0) {
          this.content = data.obj
        } else {
          this.$message.error(data.msg)
        }
      })
    }
  },
  watch: {
  }
}
</script>
<style scoped>
/* @import url(); 引入css类 */
.mdEditorCss{
  width: calc(100% - 20% + 20px) ;
  display: inline-block;
}
</style>